﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ include file="/WEB-INF/views/include/header.jsp" %>
<html>
<link rel="stylesheet" href="${Layui}/css/layui.css" media="all">
<script src="${Layui}/layui.js" charset="utf-8"></script>
<script src="${jquery}/jquery-3.1.1.js" charset="utf-8"></script>
<script src="${Js}/front/purgoods/purgoods.js" charset="utf-8"></script>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Home</title>
    <!-- JqueryUI -->
    <link rel="stylesheet" type="text/css" href="${style}/front/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="${style}/animate.min.css">

    <!-- Bootstrap -->
    <link rel="stylesheet" type="text/css" href="${style}/front/bootstrap.min.css">
    <!-- Awesome font icons -->
    <link rel="stylesheet" type="text/css" href="${style}/front/font-awesome.min.css" media="screen">
    <!-- Owlcoursel -->
    <link rel="stylesheet" type="text/css" href="${style}/front/owl-coursel/owl.carousel.css">
    <link rel="stylesheet" type="text/css" href="${style}/front/owl-coursel/owl.transitions.css">
    <!-- Magnific-popup -->
    <link rel="stylesheet" type="text/css" href="${style}/front/magnific-popup/magnific-popup.css">
    <!-- Style -->
    <link rel="stylesheet" type="text/css" href="${style}/front/style.css" media="screen">
    <!-- Fw -->
    <link rel="stylesheet" type="text/css" href="${style}/front/fw.css" media="screen">
</head>
<body class="bg-m">
<%--header--%>
<jsp:include page="header.jsp"/>

<input type="text" value="${pageIndex}" hidden id="pageIndex">
<input type="text" value="${pageCount}" hidden id="pageCount">
<!-- Banner -->
<section class="m-t-0">
    <div class="container">
        <div class="row slider slider-1">
            <div class="owl" data-items="4" data-itemsDesktop="3" data-itemsDesktopSmall="2" data-itemsTablet="2"
                 data-itemsMobile="1" data-transitionstyle="fade" data-singleItem="true" data-autoplay="true"
                 data-pag="false" data-buttons="false">
                <c:forEach items="${propagandaList}" var="item">
                    <div class="col-sm-8 col-md-9 pull-right">
                        <div class="slider-item">
                            <img src="${item.photo}" alt="image">
                            <div class="slider-caption">
                            </div>
                        </div>
                    </div>
                </c:forEach>
            </div>
        </div>
    </div>
</section>
<!-- Product tabs -->
<div>
    <div class="container text-center m-t-30">
        <h3 class="title f-30">我们的产品</h3>
        <p>正品销售  品质保证  信赖第一 客户放心</p>
        <div class="row">
            <c:forEach items="${croPurgoodsVoList}" var="croPurgoodsVo">
                <input type="text" value="${croPurgoodsVo.id}" id="goodsid" hidden>
                <div class="col-sm-6 col-md-4 col-lg-3">
                    <!-- Product item -->
                    <div class="product-item">
                        <a href="/front/goodsdetail?goodsid=${croPurgoodsVo.id}">
                            <img src="${croPurgoodsVo.imagurl}" alt="image">
                        </a>
                        <div class="product-caption">
                            <h4 class="product-name">
                                <a href="/front/goodsdetail?goodsid=${croPurgoodsVo.id}">${croPurgoodsVo.goodname}</a>
                            </h4>
                            <div class="product-price-group">
                                <span class="product-price">${croPurgoodsVo.uniprice}</span>
                            </div>
                            <div class="ht-btn-group">
                                <a href="/front/goodsdetail?goodsid=${croPurgoodsVo.id}">商品详情</a>
                            </div>
                        </div>
                    </div>
                </div>
            </c:forEach>
        </div>
    </div>
</div>

<!--分页-->
<div id="fullpage" align="center"></div>
<!-- Process order -->
<section class="process">
    <div class="container">
        <div class="row">
            <div class="col-sm-6 col-md-4">
                <div class="media ht-media">
                    <div class="media-left">
                        <i class="fa fa-phone bg-6"></i>
                    </div>
                    <div class="media-body">
                        <h5 class="media-heading">客服热线 24/7: 0123-456-789</h5>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-md-4">
                <div class="media ht-media">
                    <div class="media-left">
                        <i class="fa fa-truck bg-2"></i>
                    </div>
                    <div class="media-body">
                        <h5 class="media-heading">智能分拣     快捷物流     暖心配送</h5>
                    </div>
                </div>
            </div>
            <div class="col-sm-6 col-md-4">
                <div class="media ht-media">
                    <div class="media-left">
                        <i class="fa fa-undo bg-3"></i>
                    </div>
                    <div class="media-body">
                        <h5 class="media-heading">100%优质服务   7天无理由退换货</h5>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<%--footer--%>
<jsp:include page="footer.jsp"/>

<!-- jQuery -->
<script src="${jquery}/jquery.js" charset="utf-8"></script>
<!-- JqueryUI -->
<script src="${jquery}/jquery-ui.js"></script>
<!-- Bootstrap -->
<script src="${Bootstrap}/js/bootstrap.js"></script>
<!-- Owl-coursel -->
<script src="${Js}/front/owl-coursel/owl.carousel.js"></script>
<!-- Magnific-popup -->
<script src="${Js}/front/magnific-popup/jquery.magnific-popup.min.js"></script>
<!-- Script -->
<script src="${Js}/front/script.js"></script>
</body>
</html>